import { ref, onMounted, onBeforeUnmount } from 'vue'

//监听页面显示/隐藏
function usePageVisibility() {
    const isVisible = ref(document.visibilityState === 'visible')

    const handleVisibilityChange = () => {
        isVisible.value = document.visibilityState === 'visible'
    }

    onMounted(() => {
        document.addEventListener('visibilitychange', handleVisibilityChange)
    })

    onBeforeUnmount(() => {
        document.removeEventListener('visibilitychange', handleVisibilityChange)
    })

    return {
        isVisible,
    }
}

export default usePageVisibility
